/*盒子特性*/

@mixin box-sizing ($sizing) {
  -webkit-box-sizing: $sizing;
  -moz-box-sizing: $sizing;
  box-sizing: $sizing;
}

//css3 2d变换
@mixin transform($tf) {
  -webkit-transform: $tf;
  -moz-transform: $tf;
  -ms-transform: $tf;
  transform: $tf;
}

//css3 过渡
@mixin transition($ts) {
  -webkit-transition: $ts;
  -moz-transition: $ts;
  -ms-transition: $ts;
  transition: $ts;
}

//弹性布局flex
@mixin flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

@mixin flex-1 {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

@mixin user-select($us) {
  -moz-user-select: $us;
  /*火狐*/
  -webkit-user-select: $us;
  /*webkit浏览器*/
  -ms-user-select: $us;
  /*IE10*/
  -khtml-user-select: $us;
  /*早期浏览器*/
  user-select: $us;
}

// 毛玻璃效果
@mixin filter($val) {
  -webkit-filter: blur($val);
  -moz-filter: blur($val);
  -ms-filter: blur($val);
  filter: blur($val);
}

//制定动画
@mixin keyframes($animationName) {
  @-webkit-keyframes #{$animationName} {
    @content;
  }
  @-moz-keyframes #{$animationName} {
    @content;
  }
  @-o-keyframes #{$animationName} {
    @content;
  }
  @keyframes #{$animationName} {
    @content;
  }
}

//动画调用如下

/*
@include keyframes(move-the-object) {
    0%   { 
        transform: translateX(0);
    }
    100% { 
        transform: translateX(200px); 
    }
}
*/

// 执行动画
@mixin animate($val) {
  -webkit-animation: $val;
  animation: $val;
}

// 暂停动画
@mixin animation-play-state($val) {
  -webkit-animation-play-state: $val;
  animation-play-state: $val;
}

@mixin ellipses {
  text-overflow: ellipsis;
  overflow: hidden; // white-space:nowrap;  
}

$baseColor:#ce3d3a;
$fontColor:#333;
$linkColor:#477aac;
$basewhiteColor:#f2f4f5;
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "微软雅黑", 'sans-serif'; // color: $fontColor;
  -webkit-tap-highlight-color: transparent;
}

html {
  min-height: 100%;
  max-width: 640px;
  margin: 0 auto;
  body {
    max-width: 640px;
    margin: 0 auto;
    font-size: 14px;
    height: 100%;
    font-size: 14px;
    button,
    input {
      -webkit-appearance: none;
      outline: none;
    }
    ol,
    ul {
      list-style: none;
    }
    a,
    a:hover,
    a:focus {
      text-decoration: none;
      color: $fontColor;
      outline: none;
    }
    em,
    i {
      font-style: normal;
    }
    header.mint-header {
      background: $baseColor;
      font-size: 18px;
    }
    .bgwhite {
      background: #fff;
    } // 进度条颜色
    .mt-progress-progress {
      background: $baseColor;
    }
    // 页头右侧 音乐播放 icon
    .mint-header {
      .frequency {
        width: 26px;
        height: 26px;
        margin-top: 2px;
      }
    }
  }
}
